<template>
  <div class="home-banner">
    <!-- 轮播图 -->
    <XtxSlider :data="sliders"></XtxSlider>
  </div>
</template>

<script>
// import { ref, onMounted } from 'vue'
// 导入获取图片的接口
// import { findBanner } from '@/api/home'
import { UseBanner } from '@/hook/page'

export default {
  name: 'HomeBanner',
  setup () {
    // // 轮播图的图片
    // const sliders = ref([])
    // // 获取图片的方法
    // const getBannerList = async () => {
    //   const { result } = await findBanner()
    //   // console.log(result)
    //   sliders.value = result
    // }
    // onMounted(() => {
    //   getBannerList()
    // })
    const { sliders } = UseBanner()
    return { sliders }
  }
}
</script>

<style scoped lang='less'>
.home-banner {
  width: 1240px;
  height: 500px;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 98;
}
</style>
